<template>
  <div>
    <swiper loop auto :list="images"></swiper>
    <grid >
      <grid-item link="/registuser" label="推荐注册">
        <img slot="icon" src="../../assets/menu/推荐注册.png">
      </grid-item>
      <grid-item :link="{ path: '/transferIndex'}" label="转账">
        <img slot="icon" src="../../assets/menu/电子货币转账.png">
      </grid-item>
      <grid-item link="/netPoint" >
        <img slot="icon" src="../../assets/menu/点位图谱.png">
        <span slot="label">点位图谱</span>
      </grid-item>
    </grid>
    <grid >
      <grid-item link="/withdrawCash" label="提现申请">
        <img slot="icon" src="../../assets/menu/申请提现.png">
      </grid-item>
      <grid-item :link="{ path: '/userFinancialList'}" label="收支明细">
        <img slot="icon" src="../../assets/menu/收支明细.png">
      </grid-item>
      <grid-item link="/userCenter" >
        <img slot="icon" src="../../assets/menu/个人资料.png">
        <span slot="label">个人资料</span>
      </grid-item>
    </grid>
    <panel header="公告信息" :footer="footer" :list="msglist" type="1" @on-click-item="clickItem"></panel>
  </div>
</template>

<script>
import { Cell, Marquee, MarqueeItem, ViewBox, Swiper, Grid, GridItem, Panel } from 'vux'
import { GetPageList as GetMsgPageList } from '@/api/notice'

export default {
  components: {
    Cell,
    Marquee,
    MarqueeItem,
    ViewBox,
    Swiper,
    Grid,
    GridItem,
    Panel
  },
  data() {
    return {
      images: [
        {
          url: 'javascript:',
          img: 'static/images/gundong/anhuaheicha.png',
          title: '安化黑茶'
        }
      ],
      num: 0,
      msglist: [],
      footer: {
        title: '查看更多',
        url: 'notices'
      }
    }
  },
  created() {
    this.loadTop()
  },
  methods: {
    loadMore(q, cb) {
      GetMsgPageList(q).then(result => {
        var lst = result.data.items.map(x => {
          return {
            id: x.id,
            title: x.title,
            desc: x.content,
            isTop: x.isTop
          }
        })
        cb(lst)
      })
    },
    loadTop() {
      var _this = this
      var q = { startPage: 1, pageCount: 5 }
      _this.loadMore(q, lst => {
        if (lst.length > 0) {
          _this.msglist = lst
        }
      })
    },
    clickItem(item) {
      this.$router.push({ name: '/noticesdetail', query: { id: item.id } })
    }
  }
}
</script>
<!--
<style scoped>
.vux-notice {
  color: #666;
  line-height: 40px;
}
.uls-enter-active {
  transform: translateY(0);
  transition: all 0.3s ease;
}
.uls-leave-active {
  transform: translateY(-100%);
  transition: all 0.3s ease;
  opacity: 1;
}
.uls-enter {
  transform: translateY(100%);
  opacity: 0;
}
.uls-leave {
  transform: translateY(0);
  opacity: 0;
}
.lis {
  width: 100px;
  height: 20px;
  line-height: 20px;
}
</style>
 -->
